<template>
     <div class="order">
         <!-- 二级订单 -->
         <div class="title">
             <span v-for="(item,index) in list" :key="index" class="dd">{{item}}</span>
         </div>
         <div class="block1">
             <div v-for="(item,index) in ddlist" :key="index">
                <div>
                     <img :src="item.pic" alt="">
                </div>
                
                 <div class="right">
                     <span class="">{{item.total}}</span>
                 <span >{{item.name}}</span>
                 <span>{{item.way}}</span>
                 </div>
                 
            
            </div>
         </div>
     </div>
</template>

<script>
var pic = 'http://p1.meituan.net/business/890e571180ec909e071952bcd293b438259355.jpg'
export default {
     data(){
         return{
             list:["全部","待消费","待评价","退款"],
             ddlist:[
                 {pic:pic,total:80,way:1.2,name:"火锅"},
                 {pic:pic,total:80,way:1.2,name:"火锅"},
                 {pic:pic,total:80,way:1.2,name:"火锅"}
             ]
         }
     },
    //  methods(){
    //     shopcart_list({status:0}).then((res)=>{
    //         this.list = res.data.list;
    //         console.log(res)
    //     })
    //  }
}
</script>

<style lang="scss" scoped>
       *{
    margin: 0;
    padding: 0;
}
    .title{
        display: flex;
        justify-content: center;
        margin: 20px 0;
        text-align: center;
    } 
    
    .title .dd{
        display: inline-block;
        flex-grow: 1;

    }
    .block1 img{
        width: 100px;
    }
    .block1>div{
        width: 100%;
        height: 150px;
        margin: 10px 0;
        display: flex;
        background-color: #f5f5f5;
    }

</style>